<template>
	<view class="u-p-20">
		<view class="u-border u-p-20" @click="getDetail">
			<w-home-item title="缴费金额" value="67.2元"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="业主姓名" value="代代"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="缴费年份" value="2020年"></w-home-item>
			<u-gap height="5" bg-color="#ffffff"></u-gap>
			<w-home-item title="缴费状态" value="已缴费"></w-home-item>
		</view>
		<u-popup v-model="show" mode="center" closeable border-radius='8' width='75%'>
				<view class="u-p-40">
					<view class="">
						缴费金额：67.2元
					</view>
					<view class="u-m-t-5">
						缴费单价：1.2元
					</view>
					<view class="u-m-t-5">
						附加金额：0元
					</view>
					<view class="u-m-t-5">
						房屋面积：56平方米
					</view>
					<view class="u-m-t-5">
						用户姓名：代代
					</view>
					<view class="u-m-t-5">
						区域：七贤贡院小区
					</view>
					<view class="u-m-t-5">
						房屋地址：1号楼3单元9999房间
					</view>
					<view class="u-m-t-5">
						缴费时间：2021-03-29 08:20:36
					</view>
				</view>
			</u-popup>
	</view>
</template>

<script>
	export default {
		name:"w-bill-list",
		props: {
			item: {
				type: Object,
				default: ()=>{
					return {}
				}
			},
		},
		data() {
			return {
				show:false
			};
		},
		methods: {
			getDetail() {
				this.show = true
			}
		},
	}
</script>

<style>
.u-border:after {
	border-radius: 30rpx;
}
</style>
